<template>

    <!-- <uni-grid :column="3" :show-border="false" :square="false" @change="change">
        <uni-grid-item v-for="(item, index) in list" :index="index" :key="index">
            <view class="flex flex-col items-center justify-center py-[15rpx]">
                <image class="w-6 h-6" :src="item.url" mode="aspectFill" />
                <text class="mt-4 text-base">{{ item.text }}</text>
                <view v-if="item.badge" class="relative top-[5rpx] right-[15rpx]">
                    <uni-badge :text="item.badge" :type="item.type" />
                </view>
            </view>
        </uni-grid-item>
    </uni-grid> -->
    <view class=" flex flex-row flex-wrap justify-between items-center rounded-[20rpx] ">
        <view class="flex flex-col justify-center items-center m-[20rpx]" v-for="(item, index) in list" :key="index">
            <image class="w-[100rpx] h-[100rpx]"
                src="https://php.likeadmin.cn/uploads/images/20220930/202209301154513937d5120.png" mode="scaleToFill" @click="toPages" />
            <view class="mt-[10rpx] text-sm text-content">
                <text>我的</text>
            </view>
        </view>
    </view>
</template>
<script setup lang="ts">
const list = ref([{
    url: 'https://hellouniapp.dcloud.net.cn/static/c1.png',
    text: 'Grid 1',
    badge: '0',
    type: "primary"
},
{
    url: 'https://hellouniapp.dcloud.net.cn/static/c2.png',
    text: 'Grid 2',
    badge: '1',
    type: "success"
},
{
    url: 'https://hellouniapp.dcloud.net.cn/static/c3.png',
    text: 'Grid 3',
    badge: '99',
    type: "warning"
},
{
    url: 'https://hellouniapp.dcloud.net.cn/static/c4.png',
    text: 'Grid 4',
    badge: '2',
    type: "error"
},
{
    url: 'https://hellouniapp.dcloud.net.cn/static/c5.png',
    text: 'Grid 5'
},
])
function change() {
    console.log("change")
}
function toPages() {
    uni.navigateTo({
        url: '/pages/agreement/index'
    })
}

</script>